<template>
    <div class="bankadd_content">
      <jm-head ref="head"></jm-head>
        <div class="bankadd_info box">
            <div class="input_div box">
                <van-cell-group>
                  <van-field v-model="userName"
                    label="姓名"
                    placeholder="请输入姓名" />
                </van-cell-group>
                <van-cell-group>
                  <van-field v-model="idCard"
                    label="身份证号码"
                    placeholder="请输入身份证号码" />
                </van-cell-group>

            </div>
            <div class="btns_div box">
                <button class="save_btn" @click="onSaveBtn()" style="background-color: #d64532;">保存</button>
            </div>

        </div>
    </div>
</template>
<script>
    import { Toast } from 'vant'
    import { Dialog } from 'vant'
    import { settingName } from "@/api/setting";
    import JmHead from '../head/head'
    import Vue from 'vue'
    import { Field, CellGroup } from 'vant';

    Vue.use(Field).use(CellGroup)
    export default {
        components: {
            JmHead
        },
        data () {
            return {
                userName: '',
                idCard: '',
            }
        },
        methods: {
            onSaveBtn () {
                let userName = this.userName;
                let idCard = this.idCard;
                if (!userName) {
                    Toast.fail({message:'请输入名字', duration: 1000});
                    return;
                }
                if (!idCard) {
                    Toast.fail({message:'请输入身份证号', duration: 1000});
                    return;
                }
                Dialog.confirm({
                  message: '信息填写后无法更改，请填写个人真实信息！',
                }).then(() => {
                    this.settingName(userName,idCard);
                }).catch(() => {
                })
            },
            settingName(val,id){
                settingName({name: val,idCard:id}).then(res => {
                    if(res.code == 20001){
                        Toast.fail({message: res.info, duration: 2000});
                        return
                    }
                    Toast.success({message: "设置成功", duration: 2000});
                    this.$router.push({path: '/tixian'})
                })
            }

        },
        mounted() {
            this.userName = this.$store.state.userInfo.true_name
            this.idCard = this.$store.state.userInfo.idCard
        },
        activated() {
            this.$refs.head.setNavBarUrl()
        }
    }
</script>
<style lang="stylus" scoped>
    .van-switch--on
        background-color red
    .bankadd_content
        width 100%
        height 100vh
        overflow hidden
        background #f5f5f5
        .bankadd_info
            width 100%
            overflow hidden
            .btns_div
                width 100%
                overflow hidden
                padding 0 .3rem
                button
                    width 100%
                    border 1px solid red
                    background red
                    line-height .9rem
                    height .9rem
                    font-size .30rem
                    color #fff
                    border-radius .9rem
                    display block
                    text-align center
                    margin-top .6rem

</style>
